import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:xinxuan/common/network_image_util.dart';
import 'package:xinxuan/router/app_routers.dart';
import 'package:x_common_utils/utils/inkWell_util.dart';
import 'package:xinxuan/utils/color_util.dart';
import 'package:xinxuan/vo/good_item_vo.dart';
import 'package:get/get.dart';

class GoodItemArr extends StatelessWidget {

  final List<GoodItem> goodArr;
  final bool showMargin;
  GoodItemArr({
    required this.goodArr,
    this.showMargin = true
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 16.w),
      child: StaggeredGridView.countBuilder(
        crossAxisCount: 4, 
        staggeredTileBuilder: (int index) => StaggeredTile.fit(2),
        itemCount: goodArr.length,
        physics: NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        mainAxisSpacing: 12.h,
        crossAxisSpacing: 13.w,
        itemBuilder: (context, index) {
          return InkWellUtil.shakeProofInkWell(Container(
            width: 165.w,
            decoration: BoxDecoration(
              color: bgWhiteColor,
              borderRadius: BorderRadius.circular(5.w)
            ),
            child: Column(
              children: [
                NetworkImageUtil(
                  url: goodArr[index].thumbnail ?? '', 
                  width: 165.w, 
                  height: 165.w,
                  topLeftRadius: 5.w,
                  topRightRadius: 5.w,
                ),
                SizedBox(height: 12.h),
                Container(
                  padding: EdgeInsets.symmetric(horizontal: 6.w),
                  child: Column(
                    children: [
                      Text(
                        '${goodArr[index].title}',
                        overflow: TextOverflow.ellipsis,
                        maxLines: 2,
                        style: TextStyle(
                          color: textBlackColor,
                          fontSize: 14.sp,
                          fontWeight: FontWeight.bold
                        ),
                      ),
                      SizedBox(height: 6.h),
                      Row(
                        children: [
                          Text.rich(
                            TextSpan(
                              text: '¥',
                              style: TextStyle(
                                color: mainTextColor,
                                fontSize: 12.sp,
                                fontWeight: FontWeight.bold
                              ),
                              children: [
                                TextSpan(
                                  text: '${goodArr[index].price}',
                                  style: TextStyle(
                                    color: mainTextColor,
                                    fontSize: 16.sp,
                                    fontWeight: FontWeight.bold
                                  )
                                )
                              ]
                            )
                          ),
                          Expanded(child: Text(
                            '${goodArr[index].sales}人付款',
                            overflow: TextOverflow.ellipsis,
                            maxLines: 1,
                            textAlign: TextAlign.end,
                            style: TextStyle(
                              color: textSubtitleColor,
                              fontSize: 12.sp
                            ),
                          ))
                        ],
                      )
                    ],
                  ),
                ),
                SizedBox(height: 12.h),
              ],
            ),
          ), () {
            Get.toNamed(
              '${AppRouters.COMMON_PAGE}${AppRouters.GOOD_DETAIL_PAGE}',
              arguments: {
                'goodId': goodArr[index].id
              }
            );
          });
        }, 
      ),
    );
  }
}